{% block head %}
	<link href="{{ path }}js/plugins/datatables/DT_bootstrap.css" rel="stylesheet">
	<link href="{{ path }}js/plugins/responsive-tables/responsive-tables.css" rel="stylesheet"> 
    
    <script src="{{ path }}js/demos/demo.tables.js"></script>
    <script src="{{ path }}js/plugins/datatables/jquery.dataTables.js"></script>
    <script src="{{ path }}js/plugins/datatables/DT_bootstrap.js"></script>
	<script src="{{ path }}js/plugins/responsive-tables/responsive-tables.js"></script>
	<script type="text/javascript">
		/*
		$( $(".acc_historial[id^='mat']") ).click(function() {
			
		});
		*/
		function historial(id){
			matricula_id = id;
			if(matricula_id==""){
				alert("El estudiante no tiene matricula asignada.");
			}
			else{
				$.ajax({
						url: "/cartera/estudiantes/calendario/",
						type: "POST",
						data : {matricula_id:matricula_id,
								csrfmiddlewaretoken : $('#csrf_token >div >input').attr("value")
								 },
						dataType: "html",
						success: function(datos) {
							$('#historial').html(datos);
						}
				});
			}
		}
		
		function mail(id){
			matricula_id = id;
			if(matricula_id==""){
				alert("El estudiante no tiene matricula asignada.");
			}
			else{
				$.ajax({
						url: "/cartera/estudiantes/recordarmail/",
						type: "POST",
						data : {matricula_id:matricula_id,
								csrfmiddlewaretoken : $('#csrf_token >div >input').attr("value")
								 },
						dataType: "html",
						success: function(datos) {
							alert(datos);
						}
				});
			}
		}
		
		function sms(id){
			matricula_id = id;
			if(matricula_id==""){
				alert("El estudiante no tiene matricula asignada.");
			}
			else{
				$.ajax({
						url: "/cartera/estudiantes/recordarsms/",
						type: "POST",
						data : {matricula_id:matricula_id,
								csrfmiddlewaretoken : $('#csrf_token >div >input').attr("value")
								 },
						dataType: "html",
						success: function(datos) {
							alert(datos);
						}
				});
			}
		}
		
		$( $(".acc_imp[id^='imp']") ).click(function() {
			alert("Imprimiendo acuerdo de pago");
			url = "/cartera/estudiantes/matricula/acuerdo/" + $(this).attr('matricula');
			window.open(url);
		});
		
	</script>

{% endblock %}

{% load humanize %}

    <div class="widget">	      			
        <div class="widget widget-table">                            
            <div class="widget-header">
                <h3>
                    <i class="icon-th-list"></i>
                    Cartera de estudiantes		
                </h3>
            </div> <!-- /widget-header -->
            <div class="widget-content">
                <table class="table table-striped table-bordered table-highlight" id="tbl_cartera">        <thead>
                    <tr>
                        <th width="10%" align="center">Documento</th>
                        <th width="25%" align="center">Estudiante</th>
                        <th width="5%" align="center">Periodo</th>
                        <th width="10%" align="center">Facultad</th>
                        <th width="5%" align="center">Semestre</th>
                        <th width="10%" align="center">Crédito</th>
                        <th width="10%" align="center">Saldo</th>
                        <th width="5%" align="center">DM</th>
                        <th width="5%" align="center">SM</th>
                        <th width="15%" align="center">Acciones</th>
                    </tr>
                    </thead>
                    <tbody>
                    
                    {% for lCiclo, vCiclo in estudiantes.items %}
                        <tr class="{% cycle '' 'odd' %}">
                            <td align="center"><label>{{ vCiclo.estudiante.identificacion }}</label></td>
                            <td align="center"><label>{{ vCiclo.estudiante }}</label></td>
                            <td align="center"><label>{{ vCiclo.matricula.periodo }}</label></td>
                            <td align="center"><label>{{ vCiclo.matricula.facultad }}</label></td>
                            <td style="text-align:center"><label>{{ vCiclo.matricula.semestre }}</label></td>
                            <td style="text-align:right"><label>{{ vCiclo.matricula.valor_credito|intcomma  }}</label></td>
                            <td style="text-align:right"><label>{{ vCiclo.saldo|intcomma  }}</label></td>
                            <td style="text-align:center"><label>{{ vCiclo.dm }}</label></td>
                            <td style="text-align:center"><label>{{ vCiclo.sm|floatformat:"0"|intcomma }}</label></td>
                            <td style="text-align:center">
                            	<a href="javascript:;" id="sms{{ vCiclo.matricula.id }}" matricula="{{ vCiclo.matricula.id }}" class="acc_sms"><img src="{{ path }}images/24x24/sms.png" title="Enviar recordatorio por mensaje de texto." onclick="sms({{ vCiclo.matricula.id }});"/></a>
                                <a href="javascript:;" id="mail{{ vCiclo.matricula.id }}" matricula="{{ vCiclo.matricula.id }}" class="acc_mail"><img src="{{ path }}images/24x24/mail.png" title="Enviar recordatorio por e-mail." onclick="mail({{ vCiclo.matricula.id }});"/></a>
                                <a href="#modalHistorial" id="mat{{ vCiclo.matricula.id }}" matricula="{{ vCiclo.matricula.id }}" data-toggle="modal" class="acc_historial" onclick="historial({{ vCiclo.matricula.id }});">
                                	<img src="{{ path }}images/24x24/calculator.png"  title="Ver historial de pagos y cartera."/>
                                </a>
								<a href="javascript:;" id="imp{{ vCiclo.matricula.id }}" matricula="{{ vCiclo.matricula.id }}" class="acc_imp">
									<img src="{{ path }}images/24x24/printer.png" title="Imprimir acuerdo de pago." value="ImprimirAcu"/>
								</a>
								
							</td>
                            <!--
                            <td align="center">
                            {% if vCiclo.matricula.periodo %}
                            	<a href="#modalHistorial" id="mat{{ vCiclo.matricula.id }}" matricula="{{ vCiclo.matricula.id }}" data-toggle="modal" class="btn">Historial</a></td>
                            {% endif %}
                            -->
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div> <!-- /. widget-content -->
        </div> <!-- /. widget-table -->
	</div> <!-- /. widget -->